import './index.less'
import IMenu from './menu'
export default {
  name: 'SiderMenu',
  props: {
    collapsible: {
      type: Boolean,
      required: false,
      default: false
    },
    collapsed: {
      type: Boolean,
      required: false,
      default: false
    },
    menuData: {
      type: Array,
      required: true
    },
    theme: {
      type: String,
      required: false,
      default: 'dark'
    },
    mode: {
      type: String,
      required: false,
      default: 'inline'
    }
  },
  computed: {
    contentStyle () {
      let style = {}
      this.selectNav ? style.top = '64px' : style.top = '0'
      return style
    }
  },
  methods: {
    onSelect (obj) {
      this.$emit('menuSelect', obj)
    }
  },
  render () {
    const { collapsible, contentStyle, collapsed, menuData, onSelect, mode } = this
    return (
      <a-layout-sider
        style={contentStyle}
        class='sider-pro'
        collapsible={collapsible}
        v-model={this.collapsed}
        trigger={null}
      >
        <div class="logo" >
          <h1>平台管理</h1>
        </div>
        <IMenu
          id="menu"
          collapsed={collapsed}
          mode={mode}
          menuData={menuData}
          onSelect={onSelect}
        />
      </a-layout-sider>
    )
  }
}
